<template>
	<view class="gaodeMap">
		<view class="map" v-bind:style="{ height: windowHeight * 2 + 'rpx'}" id="container"></view>
		<view class="" @click="addMaker">添加覆盖物</view>
		<cover-view>
			<cover-view style="width: 600rpx;">112321</cover-view>
		</cover-view>
		
	</view>
</template>

<script>
	export default {
		data() {
			return {
				windowHeight: "",
			}
		},
		methods: {},
		mounted() {
			//默认高度
			uni.getSystemInfo({
				success: res => {
					this.windowHeight = res.windowHeight;
				}
			});
		}
	}
</script>

<script module="allmap" lang="renderjs">
	import {
		myAMap
	} from "@/utils/amap.js";

	let amap;
	let marker;
	const _window = window;

	export default {
		data() {
			return {
				latitude: 22.543648,
				longitude: 114.057923,
				zoom: 5
			}
		},
		methods: {
			// 添加覆盖物
			addMaker() {
				amap.add(marker);
				amap.setFitView();
			},
			//获取地图信息
			initMap() {
				myAMap().then(() => {
					// // 创建地图实例
					// amap = new AMap.Map('container', {
					// 	zoom: 5, // 地图缩放比例
					// 	zooms: [4, 20], // 地图缩放区间
					// 	center: [114.057923, 22.543648], //设置经纬度为地图中心
					// 	resizeEnable: true, // 开启地图缩放
					// });
					amap = new AMap.Map('container', {
						viewMode: '2D', // 默认使用 2D 模式，如果希望使用带有俯仰角的 3D 模式，请设置 viewMode: '3D'
						zoom: 11, // 初始化地图层级
						center: [116.397428, 39.90923] // 初始化地图中心点
					});

					//  设置个性化地图
					// var styleName = "amap://styles/" + 'darkblue'
					// amap.setMapStyle(styleName);

					// 构造点标记
					marker = new AMap.Marker({
						icon: "https://webapi.amap.com/theme/v1.3/markers/n/mark_b.png",
						position: [116.405467, 39.907761],
						anchor: 'bottom-center'
					});

					// 地图缩放事件
					amap.on('zoomend', (e) => {

					});
					amap.on("complete", function() {
						console.log("地图加载完成！");
					});

					// 地图拖拽事件
					amap.on('dragend', (e) => {

					});
				})
			},
		},
		mounted() {
			this.initMap()
		},
		beforeDestroy() {
			// 离开页面销毁地图
			amap && amap.destroy();
			amap = null
		}
	}
</script>

<style lang="scss" scoped>
</style>